<template>
	<view class="padding">
		<view class="padding">
			<view class="margin-tb-xl">
				<text class="text-xxl">修改昵称</text>
			</view>
			<view class="flex-direction-row align-center border-bottom">
				<input type="text" v-model="nickname" maxlength="20" class="flex-sub padding-tb" />
				<text class="text-df iconfont color-black-q padding" v-if="nickname.length"
					@click="clear">&#xe606;</text>
			</view>
			<view class="margin-top">
				<text class="text-sm color-black">可输入2-20个字符的昵称，支持中文、英文、数字、下划线及其组合，3个月内只能修改一次~</text>
			</view>
		</view>
		<view class="padding-tb-sm bg-df radius-sl margin-top-xl text-center" @click="submit()">
			<text class="text-lg color-white">确定</text>
		</view>
	</view>
</template>

<script>
	import {
		getUserinfo
	} from "@/common/user.js"
	export default {
		onLoad(option) {
			this.nickname = option.nickname;
		},
		data() {
			return {
				nickname: ''
			}
		},
		methods: {
			async submit() {
				if (this.nickname.length < 2) {
					uni.showToast({
						title: "昵称不能少于2个字",
						icon: "none"
					})
					return;
				}
				// 修改用户信息
				let res = await uni.$request.post('/doctorApi/updateUser', {
					doctorName: this.nickname
				});
				if (res.code == 200) {
					uni.showToast({
						title: "修改成功",
						icon: "none"
					})
					// 重新请求一下用户数据
					setTimeout(async () => {
						let res = await getUserinfo();
						// 缓存用户数据
						uni.setStorageSync('userinfo', res.data);
						// 通知其它页面
						uni.$emit('updateUser');
						uni.navigateBack();
					}, 800);
				} else {
					uni.showModal({
						content: '修改失败',
						showCancel: false
					});
				}
			},
			clear() {
				this.nickname = ''
			}
		}
	}
</script>

<style>

</style>